<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="include/head::commonHeaderList('老师投诉记录')">

</head>
<body>
<div id="content" class="col-lg-12 col-sm-12">
    <div class="row">
        <div class="box col-md-12" style="padding: 0;margin-top: 5px;">
            <div class="box-inner">
                <div class="box-header well" data-original-title="">
                    <h2>
                        <i class="glyphicon glyphicon-list"></i> <span th:text="${param.loginName}"></span> 被老师投诉记录
                    </h2>
                    <div class="box-icon">
                        <a href="javascript:void(0);" id="smaller" class="btn btn-minimize btn-round btn-default"><i class="glyphicon glyphicon-chevron-up"></i></a>
                    </div>
                </div>
                <div class="box-content">
                    <form class="form-inline form-search " role="form" method="post" th:action="@{'/teacher/complaint/list/'+${personId}}">

                        <!--<button type="submit" class="btn btn-primary" id="search" onclick="$('#pageNum').val(1)"> 查 询 </button>-->
                    </form>
                    <table class="table table-striped table-bordered table-hover" data-show-toggle="false">
                        <thead>
                        <tr>
                            <th class="text-center">#</th>
                            <th class="text-center">投诉老师</th>
                            <th class="text-center">课程时间</th>
                            <th class="text-center">投诉内容</th>
                            <th class="text-center">投诉时间</th>
                            <th class="text-center">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr th:each="item,itemStat:${pageInfo.list}">
                            <td class="text-center" th:utext="${itemStat.index+1}"></td>
                            <td class="text-center text-nowrap" th:text="${item.teacherLogin}"></td>
                            <td class="text-center text-nowrap" th:text="${#dates.format(item.releaseTime,'yyyy/MM/dd HH:mm')}"></td>
                            <td >
                                <label class="label label-danger" th:if="${item.lateCnName!=null && item.lateCnName!=''}" style="margin-right:5px;white-space:nowrap;display:inline-block;" th:text="'迟到 '+ ${item.lateCnName}"></label>
                                <label class="label label-warning" th:if="${item.tagCnName!=null && item.tagCnName!=''}" style="margin-right:5px;white-space:nowrap;display:inline-block;"
                                       th:each="items:${#strings.listSplit(item.tagCnName,',')}" th:text="${items}"></label>
                                <br th:if="${(item.lateCnName!=null && item.lateCnName!='') || (item.tagCnName!=null && item.tagCnName!='')}"/>
                                <span th:text="${item.complaints}"></span>
                            </td>
                            <td class="text-center text-nowrap" th:text="${#dates.format(item.createTime,'yyyy/MM/dd H:m:s')}"></td>
                            <td class="text-center">
                                <button class="btn btn-success btn-xs" th:if="${item.state==1}" th:onclick="viewModalComplain([[${item.handler}]],[[${#dates.format(item.handleTime,'yyyy/MM/dd H:m:s')}]],[[${item.processingResult}]])"><i class="glyphicon glyphicon-zoom-in icon-white"></i> View </button>
                                <button class="btn btn-info btn-xs" th:unless="${item.state==1}" th:onclick="|modalComplain(${item.lessonId})|"> <i class="glyphicon glyphicon-edit icon-white"></i> Edit </button>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                    <div th:include="include/pageinfo::pager"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div th:include="include/onload_js::onloadJSCustomList(~{::script})">
    <script>
        $(function() {
            // $('.footable').footable();
        })

        /**
         * 查看处理结果
         * @param handler 处理人
         * @param handleTime 处理时间
         * @param processingResult 处理结果
         */
        function viewModalComplain(handler,handleTime,processingResult) {
            let dataContent="<div style='text-align: left;padding: 15px 15px;'><table cellpadding='15'><tr><td align='right'>经办人：</td><td>"+handler+"</td></tr><tr><td align='right'>办理时间：</td><td>"+handleTime+"</td></tr><tr><td align='right' style='white-space:nowrap'>处理结果：</td><td>"+processingResult+"</td></tr></table></div>";
            layer.open({
                type: 1,
                title: '查看处理结果',
                skin: 'layui-layer-molv',
                closeBtn: 1, //不显示关闭按钮
                anim: 2,
                shadeClose: true, //开启遮罩关闭
                content: dataContent
            });
        }

        //添加处理结果
        function modalComplain(id) {
            let dataContent='<div style="text-align: center;margin: 5px 10px;width: 300px;"><textarea class="form-control" id="results" rows="5" data-toggle="tooltip" placeholder="输入处理结果......"></textarea></div>';
            layer.open({
                type: 1,
                title: '录入处理结果',
                // skin: 'layui-layer-lan',
                closeBtn: 0,
                anim: 2,
                shadeClose: false,
                content: dataContent,
                btn: ['提交','关闭'],
                yes: function(){
                    submitHandleResults(id);
                    return false;
                },
                btn2: function(){
                }
            });
        }

        //提交处理结果
        function submitHandleResults(lessonId){
            if($.trim($("#results").val())===""){
                layer.msg("输入处理结果！",{icon: 2})
                return false;
            }
            let layerIndex=layer.load(3);
            $.ajax({
                type:'post',
                url:'/teacher/complaint/add/'+lessonId,
                data:{'processingResult':$.trim($("#results").val())},
                cache:false,
                dataType:'json',
                success:function(data){
                    if(data.status==null || data.status===0){
                        layer.msg("提交处理结果失败",{icon:2});
                    }else if(data.status ===1){
                        location.reload();
                    }else{
                        layer.msg(data.status);
                    }
                    layer.close(layerIndex);
                },
                error : function(xhr, type, exception) {
                    // view("异常！");
                    layer.alert(xhr.responseText, "Failed");
                    //alert("删除数据异常，请与管理员联系！");
                }

            });
        }
    </script>

</div>
</body>
</html>